<template>

	<view class="container" style="padding-top: 40px;background-color: #FFFFFF;height: 100vh;">
		<view class="zjl_hedn">
			<span class="zjl_one">金额</span>
			<view style="display: flex; align-items: center;">
				<input type="number" value="money"  placeholder="0.00" v-model="money"    />
				<span class="zjl_two">元</span>
			</view>
		</view>
		<view class="zjl_hedn">
			<span class="zjl_one">包数</span>
			<view style="display: flex; align-items: center;">
				<input type="number" value=""  placeholder="请输入包数" v-model="num"/>
				<span class="zjl_two">个</span>
			</view>
		</view>
		<view class="person">
			本群共{{totalperson}}人
		</view>
		<view class="zjl_head">
			<input type="number" value="" v-model="lei" placeholder="备注"  />
		</view>
		<view class="sub">
			<input type="submit" value="塞钱进红包" disabled="true" @tap="toOpen('one','one','two')" />
		</view>
		<jpPwd ref="jpPwds" @completed="completed" @inputPwd="inputPwd" @forget="forget" :payType="pwd.payType" :keyType="pwd.keyType"
		 :pawType="pwd.pawType" :tite="pwd.tite" :cancelType="pwd.cancelType" :keep="pwd.keep" :msg="pwd.msg" :places="pwd.places"></jpPwd>
	</view>
</template>

<script>
	let WebIM = require("../../utils/WebIM")["default"];
	let msgType = require("../../comps/chat/msgtype");
	let disp = require("../../utils/broadcast");
	let msgStorage = require("../../comps/chat/msgstorage");
	import jpPwd from '@/components/jp-pwd/jp-pwd.vue';
	export default {
		components: {
			jpPwd
		},
		data() {
			return {
				money:'',
				numbao:'',
				beizhu:'',
				myName:"",
				your:"",
				groupId:"",
				chatType:'',
				qunid: '',
				myqid: '',
				totalperson: '',
				person: '',
				value: '恭喜发财',
				money: '',
				name: '',
				lei: '恭喜发财',
				baonum: [],
				num: '请选择',
				qunguanli: '',
				myname: '',
				minmoney:'',
				maxmoney:'',
				wfstatus:'',
				qunstauts: '',
				hidd: true,
				pwd: {
					payType: 'one', //支付样式  one two
					keyType: 'one', //键盘样式  one two
					pawType: 'one', //输入框样式  one two
					tite: '请输入支付密码', //标题
					contents: '确认收货后，就不能退换退款', //提示
					cancelType: false, //是否输入完密码后消失
					keep: false, //点击遮挡是否关闭
					msg: '', // 密码错误提示语
					places: 6
				},
			}
		},
		onLoad(option) {
			console.log(option)
			this.chatType = option.chatType
			this.myName = option.myName
			this.groupId = option.groupId
			this.your = option.your
		},
		methods: {
			upclick(hb_msg){
				let me = this;
				String.prototype.trim = function() {
					return this.replace(/(^\s*)|(\s*$)/g, "");
				};
				if (!this.money.trim()) {
					return;
				}
				let id = WebIM.conn.getUniqueId();
				let msg = new WebIM.message(msgType.TEXT, id);
				msg.set({
					msg: '红包',
					from: this.myName,
					to: this.getSendToParam(),
					ext: {
						money: this.money,
						num:this.num,
						beizhu:this.lei,
						type:0,
						hb_id:hb_msg
					},
					roomType: false,
					chatType: this.chatType,
					success(id, serverMsgId) {
						console.log("成功了");
						uni.showToast({
							title:"发包成功",
							icon:'none'
						})
						setTimeout(()=>{
							uni.navigateBack({
								delta:1
							})
						},500)
						// 关闭表情弹窗
						me.$parent.cancelEmoji()
						disp.fire("em.chat.sendSuccess", id, me.userMessage);
						
					},
					fail(id, serverMsgId) {
						console.log(msg)
						console.log("失败了");
					},
				});
				if (this.chatType == msgType.chatType.CHAT_ROOM) {
					msg.setGroup("groupchat");
				}
				try {
					WebIM.conn.send(msg.body);
					let obj = {
						msg: msg,
						type: msgType.TEXT,
					};
					this.saveSendMsg(obj);
				} catch (error) {
					console.log("error", error);
				}
				this.userMessage = "";
				this.inputMessage = "";
				uni.hideKeyboard();
			},
			isGroupChat() {
				return this.chatType == msgType.chatType.CHAT_ROOM;
			},
			
			getSendToParam() {
				return this.isGroupChat() ? this.groupId : this.your;
			},
			saveSendMsg(evt) {
				msgStorage.saveMsg(evt.msg, evt.type);
			},
			forget() {
						uni.navigateTo({
							url: '/pages/xiugaimima/zhifumima'
						})
					},
					// picker
					pickerChange(e) {
						this.num = this.baonum[e.detail.value].sum
						console.log(this.num)
					},
					toOpen(payType, keyType, pawType) {
						var that = this
						let token = uni.getStorageSync("token")
						uni.request({
							url: that.G_base + '/api/lz/qinfo',
							method: "POST",
							header: {
								'content-type': 'application/x-www-form-urlencoded',
								'Authori-zation': 'Bearer ' + token
							},
							data: {
								qid: that.groupId
							},
							success: (res) => {
								console.log(res)
								that.qunguanli = res.data.data.owner
								console.log(that.qunguanli)
								// console.log(this.totalperson.length);
								console.log("群管理员")
								if (that.money == '') {
									uni.showToast({
										title: '请输入金额',
										icon: 'none'
									})
								}else {
									this.pwd.payType = payType
									this.pwd.keyType = keyType
									this.pwd.pawType = pawType
									this.pwd.places = 6
									this.$refs.jpPwds.toOpen()
									this.hidd = false
								}
							},
							fail: (err) => {
								console.log(err)
							}
						});
			
					},
					completed(e) {
						// console.log(e)
						// console.log(this)
						let that = this
						let token = uni.getStorageSync("token")
						uni.request({
							url: this.G_base + '/api/lz/zfpas',
							data: {
								pas: e
							},
							method: "POST",
							header: {
								'content-type': 'application/x-www-form-urlencoded',
								'Authori-zation': 'Bearer ' + token
							},
							success: (res) => {
								console.log(res)
								if (res.data.status == 200) {
									uni.request({
										url: this.G_base + '/api/lz/jfhb',
										data: {
											qid:0,
											money:this.money,
											b_num:this.num,
											y_number:1,
											hxq_id:this.groupId,
											account:this.myName,
											status:2
										},
										method: "POST",
										header: {
											'content-type': 'application/x-www-form-urlencoded',
											'Authori-zation': 'Bearer ' + token
										},
										success: (res) => {
											console.log(res)
											if (res.data.status == 200) {
												
												that.upclick(res.data.data.hbid);
											} else {
												uni.showToast({
													title:res.data.msg,
													icon:"none"
												})
											}
										},
										fail: (err) => {
											console.log(err)
												
										}
									});
									
								} else {
									that.pwd.msg = '密码错误'
									that.$refs.jpPwds.backs()
								}
							},
							fail: (err) => {
								console.log(err)
			
							}
						});
					},
					inputPwd(e) {
						console.log(e)
						this.pwd.msg = ''
					},
			
					sendImage() {
						this.$refs.image.sendImage();
					},
					goback() {
						uni.navigateBack({
							delta: 1
						})
					}
		}
	}
</script>

<style scoped>
	.zjl_hedn,
	.zjl_head {
		width: 90%;
		height: 50px;
		border-radius: 10px;
		margin: 30upx auto 0;
		background-color: #FAFAFA;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 20upx;
		box-sizing: border-box;
	}

	.zjl_head input {
		width: 100%;
		color: #CACACA;
	}

	.zjl_one {
		color: #000000;
		font-size: 16px;
		font-weight: bloder;
	}

	.zjl_two {
		z-index: 9999;
		color: #000000;
		font-size: 16px;
		font-weight: bloder;

	}

	.zjl_hedn input {
		width: 40px;
		margin-right: 20upx;
	}

	.zjl_int {
		color: #CCCCCC;
	}

	.person {
		width: 90%;
		font-size: 13px;
		margin: 30upx 50upx 0;
	}

	.sub {
		margin-top: 71px;
		display: flex;
		color: #FFFFFF;
		text-align: center;
		font-family: KaiTi_GB2312;
		justify-content: center;
		align-items: center;
		margin-bottom: 100px;
		background: -webkit-linear-gradient(left, #a00000, #e10004, #a00000);
		width: 160px;
		height: 50px;
		border-radius: 40px;
		margin-left: 50%;
		transform: translateX(-50%);
	}

	/deep/.uni-nav-bar-text {
		font-family: Microsoft YaHi;
		font-weight: 500;
	}
</style>

